<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">

      <el-form-item label="" prop="scddCreate">
        <el-input
          v-model="queryParams.scddCreate"
          placeholder="关键字筛选"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['scdd:form:add']"
        >新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['scdd:form:edit']"
        >修改</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['scdd:form:remove']"
        >删除</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['scdd:form:export']"
        >导出</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="formList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="订单状态" align="center" prop="ddStatus" :formatter="orderStatus" />
      <el-table-column label="优先级" align="center" prop="ddLevel" :formatter="ddLevel" />
      <el-table-column label="订单进度" align="center" prop="">
        <template slot-scope="scope">
          <el-progress type="line" :percentage="20" :format="20" color="#57DCDD" :text-inside="false" :stroke-width="12" />
        </template>
      </el-table-column>
      <el-table-column label="订单号" align="center" prop="ddCode" />
      <el-table-column label="订单类型" align="center" prop="ddTypecode" :formatter="orderType" />
      <el-table-column label="订单性质" align="center" prop="ddGoodcode" :formatter="orderAbility" />
      <el-table-column label="订单客户" align="center" prop="ksMerchant.merchantsName" />
      <el-table-column label="合同编号" align="center" prop="htCode" />
      <el-table-column label="产品编码" align="center" prop="cpProduct.cpCode" />
      <el-table-column label="产品名称" align="center" prop="cpProduct.cpName" />
      <el-table-column label="产品型号" align="center" prop="cpProduct.cpType" />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="details(scope.row)"
          >详情</el-button>
          <el-button
            v-if="scope.row.ddStatus !== 1"
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="updateStatus(scope.row,1)"
          >下发</el-button>
          <el-button
            v-if="scope.row.ddStatus === 1"
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="updateStatus(scope.row,0)"
          >终止</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
          >编辑</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
          >删除</el-button>
        </template>
      </el-table-column>
    </el-table>


    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改生产订单对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="100px" :inline="true" style="font-size: 10px">
        <el-form-item label="订单优先级" prop="ddLevel">
          <el-select v-model="form.ddLevel" placeholder="请选择" prop="ddLevel">
            <el-option label="一级" value="1"></el-option>
            <el-option label="二级" value="2"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="订单类型" prop="ddTypecode">
          <el-select v-model="form.ddTypecode" placeholder="请选择">
            <el-option label="普通订单" value="1"></el-option>
            <el-option label="OEM订单" value="2"></el-option>
            <el-option label="销售订单" value="3"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="订单性质" prop="ddGoodcode">
          <el-select v-model="form.ddGoodcode" placeholder="请选择">
            <el-option label="销售" value="1"></el-option>
            <el-option label="样品" value="2"></el-option>
            <el-option label="研发" value="3"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="合同编号" prop="htCode">
          <el-input v-model="form.htCode" placeholder="请输入" />
        </el-form-item>
        <el-form-item label="订单客户" prop="ksCode">
          <el-input v-model="form.ksMerchant.merchantsName" placeholder="请输入" readonly
                    @click.native="getMerchants" suffix-icon="el-icon-more"/>
        </el-form-item>

        <el-form-item label="产品名称" prop="cpProduct.cpName">
          <el-input v-model="form.cpProduct.cpName" placeholder="请输入" readonly
                    @click.native="getProduct" suffix-icon="el-icon-more"/>
        </el-form-item>
        <el-form-item label="产品编码" prop="cpProduct.cpCode">
          <el-input v-model="form.cpProduct.cpCode" placeholder="" readonly />
        </el-form-item>
        <el-form-item label="产品型号" prop="cpProduct.cpType">
          <el-input v-model="form.cpProduct.cpType" placeholder=""  readonly/>
        </el-form-item>
        <el-form-item label="订单数量" prop="ddNum">
          <el-input v-model="form.ddNum" placeholder="请输入" />
        </el-form-item>
        <el-form-item label="交货日期" prop="jhDate">
          <el-date-picker clearable
            v-model="form.jhDate"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="请选择">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="开始时间" prop="startTime">
          <el-date-picker clearable
            v-model="form.startTime"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="请选择">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="完成时间" prop="finishTime">
          <el-date-picker clearable
            v-model="form.finishTime"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="请选择">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="备注" prop="other">
          <el-input type="textarea" v-model="form.other" placeholder="请输入备注" id="other"/>
        </el-form-item>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    <!--订单详情-->
    <el-dialog :title="scddTitle" :visible.sync="scddOpen" width="600px" append-to-body>
      <div class="dialog-content">
      <el-form ref="form" :model="form" label-width="120px" style="font-size: 10px">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="订单优先级：" prop="ddLevel">
              <span>{{ form.ddLevel }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="订单类型：" prop="ddTypecode">
              <span>{{ form.ddTypecode }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="订单性质：" prop="ddGoodcode">
              <span>{{ form.ddGoodcode }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="合同编号：" prop="htCode">
              <span>{{ form.htCode }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="订单客户：" prop="ksCode">
              <span>{{ form.ksMerchant.merchantsName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="产品名称：" prop="cpName">
              <span>{{ form.cpProduct.cpName }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="产品编码：" prop="cpCode">
              <span>{{ form.cpProduct.cpCode }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="产品型号：" prop="cpType">
              <span>{{ form.cpProduct.cpType }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="订单数量：" prop="ddNum">
              <span>{{ form.ddNum }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="交货日期：" prop="jhDate">
              <span>{{ form.jhDate }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="开始时间：" prop="startTime">
              <span>{{ form.startTime }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="完成时间：" prop="finishTime">
              <span>{{ form.finishTime }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="备注：" prop="other">
              <span>{{ form.other }}</span>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>


      <!-- 标签页部分 -->
<!--      <el-tabs v-model="activeTab">-->
<!--        <el-tab-pane label="生产BOM" name="bom">-->
<!--          <el-table :data="bomData" style="width: 100%">-->
<!--            <el-table-column prop="序号" label="序号" width="50"></el-table-column>-->
<!--            <el-table-column prop="物料名称" label="物料名称"></el-table-column>-->
<!--            <el-table-column prop="物料编码" label="物料编码"></el-table-column>-->
<!--            <el-table-column prop="物料类型" label="物料类型"></el-table-column>-->
<!--            <el-table-column prop="物料规格" label="物料规格"></el-table-column>-->
<!--            <el-table-column prop="物料单位" label="物料单位"></el-table-column>-->
<!--            <el-table-column prop="物料来源" label="物料来源"></el-table-column>-->
<!--            <el-table-column prop="基本用量" label="基本用量"></el-table-column>-->
<!--          </el-table>-->
<!--        </el-tab-pane>-->

<!--        <el-tab-pane label="产品属性" name="attributes">-->
<!--          &lt;!&ndash; 产品属性内容 &ndash;&gt;-->
<!--          <el-table :data="attributesData" style="width: 100%">-->
<!--            <el-table-column prop="序号" label="序号" width="50"></el-table-column>-->
<!--            <el-table-column prop="属性名称" label="属性名称"></el-table-column>-->
<!--            <el-table-column prop="属性值" label="属性值"></el-table-column>-->
<!--          </el-table>-->
<!--        </el-tab-pane>-->

<!--      </el-tabs>-->

<!--      &lt;!&ndash; 工序生产进度表格 &ndash;&gt;-->
<!--      <el-table :data="productionProgressData" style="width: 100%; margin-top: 20px;">-->
<!--        <el-table-column prop="序号" label="序号" width="50"></el-table-column>-->
<!--        <el-table-column prop="工序名称" label="工序名称"></el-table-column>-->
<!--        <el-table-column prop="工序类型" label="工序类型"></el-table-column>-->
<!--        <el-table-column prop="生产位置" label="生产位置"></el-table-column>-->
<!--        <el-table-column prop="生产人员" label="生产人员"></el-table-column>-->
<!--        <el-table-column prop="生产进度" label="生产进度">-->
<!--          <template slot-scope="scope">-->
<!--            <el-progress :text-inside="true" :stroke-width="18" :percentage="scope.row.生产进度"></el-progress>-->
<!--          </template>-->
<!--        </el-table-column>-->
<!--      </el-table>-->
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="scddBtn">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 产品弹框 -->
    <el-dialog title="选择产品" :visible.sync="selectCp" width="30%">
      <el-container>
        <el-header>
          <el-input suffix-icon="el-icon-search" v-model="cpNameTwo"
          ></el-input>
        </el-header>
        <el-main>
          <!-- 展示产品信息 -->
          <el-table border :data="cpList" @row-click="updateCp">
            <el-table-column prop="cpCode" label="产品编码" width="140px"></el-table-column>
            <el-table-column prop="cpName" label="产品名称"></el-table-column>
            <el-table-column prop="cpflProductClassification.cpflName" label="产品分类"></el-table-column>
            <el-table-column prop="cpType" label="产品型号"></el-table-column>
          </el-table>
        </el-main>
      </el-container>
    </el-dialog>
    <el-dialog title="选择客商" :visible.sync="ksSelect" width="30%">
      <el-container>
        <el-header>
          <el-input suffix-icon="el-icon-search" v-model="ksName"
          ></el-input>
        </el-header>
        <el-main>
          <!-- 展示客商信息 -->
          <el-table border :data="ksMerchantsList" @row-click="updateKs">
            <el-table-column prop="merchantsName" label="客商名称" width="140px"></el-table-column>
            <el-table-column prop="ksLevelCode" label="客商等级" :formatter="merchantsLevel"></el-table-column>
            <el-table-column prop="ksIndustryCode" label="所属行业" :formatter="merchantsIndustryCode"></el-table-column>
          </el-table>
        </el-main>
      </el-container>
    </el-dialog>
    <!-- 确认下发的弹窗 -->
    <el-dialog
      title="订单状态修改"
      :visible.sync="dialogVisible"
      width="30%"
      @close="handleClose"
    >
      <span>确定要修改该订单状态吗？</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取消</el-button>
        <el-button type="primary" @click="updateStatusTwo">确定</el-button>
      </span>
    </el-dialog>
  </div>


</template>

<script>
import {listForm, getForm, delForm, addForm, updateForm, getMerchantsList, getProductList} from "@/api/scdd/form";


export default {
  name: "Form",
  data() {
    return {
      //下发弹窗
      dialogVisible: false,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 子表选中数据
      checkedKsMerchants: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 生产订单表格数据
      formList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      //详情是否显示弹出层
      scddOpen:false,
      //产品信息
      cpProduct:null,
      cpList:[],
      selectCp:false,
      cpSelect:null,
      cpNameTwo:null,
      cpCode:null,
      cpDetailsTwo:null,
      cpTotal:0,
      //详情标题
      scddTitle:"订单详情",
      //显示客商信息
      ksSelect:false,
      ksMerchantsList: [],
      //客商总条数
      ksTotal:0,
      //客户信息
      ksMerchant:null,
      //客商名称
      ksName:null,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        ddCode: null,
        ddLevel: null,
        ddStatus: null,
        ddTypecode: null,
        ddGoodcode: null,
        ksCode: null,
        htCode: null,
        cpCode: null,
        ddNum: null,
        jhDate: null,
        startTime: null,
        finishTime: null,
        other: null,
        isUse: null,
        isDelete: null,
        scddCreate: null,
        createTime: null,
        updateTime: null
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        ddLevel: [
          { required: true, message: "订单优先级不能为空", trigger: "blur" }
        ],
        ddStatus: [
          { required: true, message: "订单状态不能为空", trigger: "change" }
        ],
        ddTypecode: [
          { required: true, message: "订单类型不能为空", trigger: "blur" }
        ],
        ddGoodcode: [
          { required: true, message: "订单性质不能为空", trigger: "blur" }
        ],
        ksCode: [
          { required: true, message: "客户不能为空", trigger: "blur" }
        ],
        htCode: [
          { required: true, message: "合同编号不能为空", trigger: "blur" }
        ],
        "cpProduct.cpName": [
          { required: true, message: "产品名称不能为空", trigger: "blur" }
        ],
        "cpProduct.cpCode":[
          {required:true,message:"产品编码不能为空",trigger:"blur"}
        ],
        "cpProduct.cpType":[
          {required:true,message:"产品型号不能为空",trigger:"blur"}
        ],
        ddNum: [
          { required: true, message: "订单数量不能为空", trigger: "blur" }
        ],
        jhDate: [
          { required: true, message: "交货日期不能为空", trigger: "blur" }
        ],
        startTime: [
          { required: true, message: "计划开始时间不能为空", trigger: "blur" }
        ],
        finishTime: [
          { required: true, message: "计划完成时间不能为空", trigger: "blur" }
        ],
        other: [
          { required: true, message: "备注不能为空", trigger: "blur" }
        ],
      }
    };
  },
  created() {
    this.getList();
  },
  methods: {
    /**订单状态*/
    orderStatus(row, column, cellValue){
      if (cellValue=='1'){
        return "已下发";
      }else{
        return "未下发";
      }
    },
    /**订单优先级*/
    ddLevel(row, column, cellValue){
      if (cellValue=="1"){
        return "一级";
      }else{
        return  "二级";
      }
    },
    /**查询产品列表*/
    getProduct(){
      this.selectCp=true;
      getProductList(this.cpName).then(response => {
        this.cpList = response.rows;
        this.cpTotal = response.total;
      });
    },
    /**查询客商列表*/
    getMerchants(){
      this.ksSelect=true;
      getMerchantsList(this.ksName).then(response => {
        this.ksMerchantsList = response.rows;
        this.ksTotal = response.total;
      });
    },
    //订单类型
    orderType(row, column, cellValue){
      if (cellValue=="1"){
        return "普通订单";
      }else if(cellValue=="2"){
        return "OEM订单";
      }else{
        return "在库订单";
      }
    },
    //选择客商
    updateKs(row,column){
      this.form.ksMerchant=row;
      this.form.ksCode=row.ksCode;
      console.log(this.form);
      this.ksSelect=false;
      // 确保销售部门字段触发验证
      this.$refs.form.validateField('ksCode');
    },
    updateCp(row,column){
      this.form.cpProduct=row;
      this.form.cpCode=row.cpCode;
      this.selectCp=false;
      this.$refs.form.validateField('cpProduct.cpName');
    },
    //订单性质
    orderAbility(row, column, cellValue){
      if (cellValue=='1'){
        return "销售";
      }else if(cellValue=='2'){
        return "样品";
      }else{
        return "研发";
      }
    },
    //客商等级
    merchantsLevel(row, column, cellValue){
      if (cellValue=="1"){
        return "一级";
      }else if(cellValue=="2"){
        return  "二级";
      }else{
        return "三级";
      }
    },
    //客商行业
    merchantsIndustryCode(row, column, cellValue){
      if (cellValue=="1"){
        return "IT";
      }else{
        return "百货";
      }
    },
    /** 查询生产订单列表 */
    getList() {
      this.reset();
      this.loading = true;
      listForm(this.queryParams).then(response => {
        this.formList = response.rows;
        this.total = response.total;
        this.loading = false;
        console.log(this.formList)
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    handleClose(){},
    // 表单重置
    reset() {
      this.form = {
        ddCode: null,
        ddLevel: null,
        ddStatus: 1,
        ddTypecode: null,
        ddGoodcode: null,
        ksCode: null,
        htCode: null,
        cpCode: null,
        ddNum: null,
        jhDate: null,
        startTime: null,
        finishTime: null,
        cpProduct:{cpName:null,cpCode:null,cpType:null},
        ksMerchant:{merchantsName:null,ksCode:null},
        other: null,
        isUse: 1,
        isDelete: 1,
        scddCreate: 'admin',
        createTime: Date.now(),
        updateTime: Date.now()
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.ddCode)
      this.single = selection.length!==1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加生产订单";
    },
    /**详情按钮操作*/
    details(row){
      this.reset();
      getForm(row.ddCode).then(response => {
        this.form = response.data;
        console.log(this.form)
        this.scddOpen=true;

      });
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const ddCode = row.ddCode || this.ids
      getForm(ddCode).then(response => {
        this.form = response.data;
        this.ksMerchantsList = response.data.ksMerchantsList;
        this.open = true;
        this.title = "修改生产订单";
      });
    },
    //详情确认按钮
    scddBtn(){
      this.scddOpen=false;
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.ddCode != null) {
            updateForm(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            console.log(this.form);
            addForm(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 下发或终止弹窗赋值 */
    updateStatus(row,status){
      this.dialogVisible=true;
      this.reset();
      this.form.ddCode=row.ddCode;
      this.form.ddStatus=status;
    },
    updateStatusTwo(){
      updateForm(this.form).then(response => {
        this.$modal.msgSuccess("修改成功");
        this.dialogVisible = false;
        this.getList();
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ddCodes = row.ddCode || this.ids;
      this.$modal.confirm('是否确认删除生产订单编号为"' + ddCodes + '"的数据项？').then(function() {
        return delForm(ddCodes);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
    },
	/** 客商序号 */
    rowKsMerchantsIndex({ row, rowIndex }) {
      row.index = rowIndex + 1;
    },
    /** 客商添加按钮操作 */
    handleAddKsMerchants() {
      let obj = {};
      obj.merchantsName = "";
      obj.ksTypeCode = "";
      obj.merchantsAbbreviation = "";
      obj.ksLevelCode = "";
      obj.ksAttributeCode = "";
      obj.ksIndustryCode = "";
      obj.contactPerson = "";
      obj.phone = "";
      obj.email = "";
      obj.address = "";
      obj.isStart = "";
      obj.isDelete = "";
      this.ksMerchantsList.push(obj);
    },
    /** 客商删除按钮操作 */
    handleDeleteKsMerchants() {
      if (this.checkedKsMerchants.length == 0) {
        this.$modal.msgError("请先选择要删除的客商数据");
      } else {
        const ksMerchantsList = this.ksMerchantsList;
        const checkedKsMerchants = this.checkedKsMerchants;
        this.ksMerchantsList = ksMerchantsList.filter(function(item) {
          return checkedKsMerchants.indexOf(item.index) == -1
        });
      }
    },
    /** 复选框选中数据 */
    handleKsMerchantsSelectionChange(selection) {
      this.checkedKsMerchants = selection.map(item => item.index)
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download('scdd/form/export', {
        ...this.queryParams
      }, `form_${new Date().getTime()}.xlsx`)
    }
  }
};
</script>
<style>
.el-date-editor.el-input, .el-date-editor.el-input__inner{
  width: 202px;

}
input.el-input__inner{
  width:202px;
}
#other{
  width: 252%;
  height: 80px;
}
.dialog-content {
  max-height: 600px; /* 根据需要调整 */
  overflow-y: auto;
  padding-right: 15px; /* 为了避免滚动条覆盖内容 */
}
.dialog-footer {
  text-align: right;
}
</style>



